<template>
<div id="app">
  <router-view/>

  <tab-bat>
    <!-- 可以传入每个字体的color -->
    <tab-bat-item path="/home" activeColor="blue">
      <img slot="item-icon" src="@/assets/images/tabbar/home.svg" alt="">
      <img slot="item.icon-active" src="@/assets/images/tabbar/home_active.svg" alt="">
      <p slot="item-text">首页</p>
    </tab-bat-item>
    <tab-bat-item path="/category">
       <img slot="item-icon" src="@/assets/images/tabbar/category.svg" alt="">
        <img slot="item.icon-active" src="@/assets/images/tabbar/category_active.svg" alt="">
      <p slot="item-text">分类</p>
    </tab-bat-item>
    <tab-bat-item path="/cart">
       <img slot="item-icon" src="@/assets/images/tabbar/shopcart.svg" alt="">
        <img slot="item.icon-active" src="@/assets/images/tabbar/shopcart_active.svg" alt="">
      <p slot="item-text">购物车</p>
    </tab-bat-item>
    <tab-bat-item path="/profile">
       <img slot="item-icon" src="@/assets/images/tabbar/profile.svg" alt="">
        <img slot="item.icon-active" src="@/assets/images/tabbar/profile_active.svg" alt="">
      <p slot="item-text">我的</p>
    </tab-bat-item>
    
  </tab-bat>
  
</div>
 
</template>

<script>

import TabBat from './components/tabbar/TabBat.vue'
import TabBatItem from './components/tabbar/TabBatItem.vue'
export default {
  name: 'App',
  components:{
    TabBat,
    TabBatItem
    
  }
}
</script>

<style>
/* 引入初始化样式css */
@import "./assets/css/base.css";


</style>
